<template>
	<div class="wrap">
		<div style="height:50px"></div>
		<div class="logo"></div>
		<div class="btn">
			<p v-link='{name:"type",params:{typeId:type.id}}'
			   v-for='type in types'
			   @click='entryDetail(type.id)'
			   class="type">
			{{ type.name }}
			</p>
		</div>
		<div class="introduction">
			<p>api地址:<a href="http://apistore.baidu.com/apiworks/servicedetail/987.html">http://apistore.baidu.com/apiworks/servicedetail/987.html</a></p>
		</div>
	</div>
	
</template>

<script>
	

	export default{
		vuex:{
			actions:{
				entryDetail:function({dispatch},id){
					dispatch('ENTRY_DETAIL',id)
				}
			},getters:{
				types:function(state){
					return state.types;
				}
			}
		}
	}
</script>

<style scope lang='scss'>
	.wrap{
		position: relative;
		padding:10px;
		/*margin-top: 50px;*/
	}
	.logo{
		background-image: url(../assets/logo.gif);
		background-position: center;
		background-repeat: no-repeat;
		height:150px;
		margin-bottom:20px;
	}
	.introduction{
		margin-top: 50px;
		width: 100%;
		word-wrap: break-word;
		a{
			display: block;
		}
	}
	.btn{
		text-align: center;
	}
	.type{
		display: inline-block;
		border-radius: 6px;
		margin:5px;
		padding: 5px;
		background-color: #caebfb;
		color: #14a6ef;
		text-align: center;
	}
</style>